<script setup lang="ts">
  import { onShow, onUnload } from "@dcloudio/uni-app";
  import { ref } from "vue";
  import GoodsItem from "@/components/GoodsItem.vue";

  const
    data = ref<gt.sql.order[]>([]),
    refresh = ref(0);
  let current = 0, run = true;
  async function fetch() {
    if (run || !current) {
      const rule: gt.Rp<gt.sql.order> = { "#rule": [{ field: "gid", logic: "=", value: api.me.gid }], "#page": { current: ++current, size: 10 }, "#order": [["createTime", "DESC"]] };
      // if (type.value) {
      //   rule["#rule"].push({ field: "type", logic: "=", value: types[type.value] });
      // }
      const r = await gd.order.read(rule);
      if (current > 1) {
        data.value.push(...r.data);
      } else {
        data.value = r.data;
      }
      run = data.value.length > r.total;
    }
  }
  async function confirm(p: gt.sql.order) {
    const r = await api.request({ id: p.id }, "order/send");
    if (r) {
      // await gd.order.getById(p.id, true);
      p.sendTime = parseInt(new Date().getTime() / 1000);
      refresh.value ^= 1;
    }
  }
  function tel(p: gt.sql.order) {
    if (p.recvAddr.phone) {
      uni.makePhoneCall({ phoneNumber: p.recvAddr.phone });
    }
  }

  function init() {
    uni.setNavigationBarTitle({ title: "消费单据" });
    fetch();
  }
  onShow(() => {
    uni.$on("loaded", init);
  });

  function unload() {
    uni.$off("loaded", init);
  }
  onUnload(unload);

</script>
<template>
  <view class="order y p04em whf oh">
    <scroll-view v-if="!!data.length" scroll-y class="fg1 wf oh mt1em" @scrolltolower="fetch" :key="refresh">
      <view class="group y mt1em" v-for="(i, ii) in data" :key="ii">
        <view class="label x">
          (<view class="in" v-if="i.payTime > 0">{{ i._t }}</view>
          <view class="out" v-else>未支付</view>)
          <text class="info" @click="tel(i)">{{ i._createTime }}</text>
        </view>
        <view :class="i.recvAddr.phone ? 'mac-ico-tel' : ''" @click="tel(i)">
          <text class="info">{{ i._recvAddr }}</text>
        </view>
        <view class="out" v-for="(j, ji) in i.content" :key="ji">
          <GoodsItem :modelValue="j._stock?._goods" :sum="j.sum" row />
        </view>
        <view class="bx confirm cg" v-if="i.payTime > 0 && i.sendTime == 0" @click="confirm(i)">发货</view>
      </view>
    </scroll-view>
    <view class="whf xcc cb" v-else>当前数据为空</view>
  </view>
</template>
<style lang="scss" scoped>
  .order {
    position: relative;
    .group {
      position: relative;
      background-color: aliceblue;
      padding: 0.4em;
      border-radius: 0.2em;
      .mac-ico-tel::before {
        color: $uni-color-success;
        font-weight: 600;
        margin-right: 0.4em;
      }
      .in {
        color: $uni-color-success;
      }
      .out {
        color: $uni-color-error;
      }
      >.confirm {
        position: absolute;
        color: $uni-color-success;
        padding: 0.2em;
        top: 0.2em;
        right: 0.4em;
      }
      .info {
        color: $uni-text-color-placeholder;
      }
    }
  }
</style>